<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>学生管理</title>

    <%@ include file="base.jsp" %>

    <link rel="stylesheet" href="css/x-admin.css" media="all"/>
    <script src="lib/layui/layui.js" charset="utf-8"></script>
    <script src="js/x-layui.js" charset="utf-8"></script>
    <script src="js/jquery-3.6.0.js"></script>
    <script>

        //前端校验
        //onsubmit 事件是提交时触发，如果事件触发的函数返回false，表单不提交，如果返回true，表单提交
        function checkForm() {
            var academyName = document.getElementById("academyName").value;
            let $ssex = $(":radio:checked[name=ssex]")

            var cid = document.getElementById("cid").value;
            var zid = document.getElementById("zid").value;
            var sid = document.getElementById("sid").value;

            if (null == sid || sid == '') {
                alert("请输入学号");
                return false;
            }
            if (null == academyName || academyName == '') {
                alert("请输入学生名称");
                return false;
            }
            if ($ssex.length == 0) {
                alert("请选择性别");
                return false;
            }
            if (null == cid || cid == '') {
                alert("请选择所属学院");
                return false;
            }
            if (null == zid || zid == '') {
                alert("请选择所属专业");
                return false;
            }
            x_admin_close();
            return true;
        }
    </script>
    <script src="js/jquery-3.6.0.js"></script>
    <script>
        $(function () {
            var sid = ${param.sid};
            <%--渲染二级联动信息--%>
            var cid = ${requestScope.cid};
            console.log("ccciiiddd:", cid)
            $.ajax({
                url: '<%=request.getContextPath()%>/admin/studentController',
                data: {
                    'fun': 'colleges',
                    'cid': cid
                },
                dataType: 'json',
                success(data) {
                    $('#zid').append("<option value=''>--请选择专业--</option>")
                    for (let i = 0; i < data.length; i++) {
                        $('#zid').append("<option value='" + data[i]['zid'] + "'>" + data[i]['zname'] + "</option>")
                    }
                }
            }).then($.ajax({
                url: '<%=request.getContextPath()%>/admin/studentController',
                data: {
                    "fun": "getStudent",
                    "sid": sid
                },
                dataType: 'json',
                success(data) {
                    $('#sid').val(data.sid)
                    $('#academyName').val(data.sname)
                    $('#zid').val(data.zid)
                    $('#cid').val(data.cid)

                    let sex = data.ssex;
                    if (sex === '男') {
                        $('#nan').attr('checked', 'checked')
                    } else {
                        $('#nv').attr('checked', 'checked')
                    }
                }
            }))

            $('#cid').change(function () {
                $('#zid').empty()//清空上次查到的所有专业
                var cid = $(':selected[name=coll]').val();
                $.ajax({
                    url: '<%=request.getContextPath()%>/admin/studentController',
                    data: {
                        'fun': 'colleges',
                        'cid': cid
                    },
                    dataType: 'json',
                    success(data) {
                        $('#zid').append("<option value=''>--请选择专业--</option>")
                        for (let i = 0; i < data.length; i++) {
                            $('#zid').append("<option value='" + data[i]['zid'] + "'>" + data[i]['zname'] + "</option>")
                        }
                    }
                })
            })
        })
    </script>
</head>

<body>
<div class="x-body">
    <form action="admin/studentController" method="post" target="_parent" onsubmit="return checkForm()">
        <input type="hidden" name="fun" value="update"/>
        <input type="hidden" name="total" value="${param.total}"/>
        <input type="hidden" name="pages" value="${param.pages}"/>
        <input type="hidden" name="pn" value="${param.pn}"/>
        <input type="hidden" name="tid" value="${param.tid}"/>

        <div class="layui-form-item">
            <label for="sid" class="layui-form-label"> <span class="x-red">*</span>学号
            </label>
            <div class="layui-input-inline">
                <input type="text" id="sid" name="sid" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>必填
            </div>
        </div>

        <div class="layui-form-item">
            <label for="academyName" class="layui-form-label"> <span class="x-red">*</span>学生姓名
            </label>
            <div class="layui-input-inline">
                <input type="text" id="academyName" name="sname" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>必填
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"> <span class="x-red">*</span>性别
            </label>
            <div class="layui-input-inline">
                <label for="nan"><input type="radio" name="ssex" id="nan" value="男" class="layui-btn-radius">男</label>
                <label for="nv"> <input type="radio" name="ssex" id="nv" value="女" class="layui-btn-radius">女</label>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>必填
            </div>
        </div>

        <div class="layui-form-item">
            <label for="cid" class="layui-form-label"> <span class="x-red">*</span>所属学院
            </label>
            <div class="layui-input-inline">
                <select name="cid" id="cid" class="layui-select" style="width: 200px;">
                    <option name="coll" value="">--请选择学院--</option>
                    <c:forEach items="${list}" var="i">
                        <option name="coll" value="${i.cid}">${i.cname}</option>
                    </c:forEach>
                </select>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>必填
            </div>
        </div>

        <div class="layui-form-item">
            <label for="zid" class="layui-form-label"> <span class="x-red">*</span>所属专业
            </label>
            <div class="layui-input-inline">
                <select name="zid" id="zid" class="layui-select" style="width: 200px;">
                </select>
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>必填
            </div>
        </div>

        <div class="layui-form-item">
            <label class="layui-form-label"></label>
            <button type="submit" class="layui-btn">修改</button>
        </div>
    </form>
</div>
</body>

</html>